<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // 箭头函数  => ES6 允许使用“箭头”（=>）定义函数。 (可以让函数写起来更简单, 代码更清晰)

    // 普通函数改箭头函数的步骤
    // 1. 将函数改为匿名函数 => 箭头函数都是匿名函数
    // 2. 省略function关键词,并在形参的小括号之后加 => 
    // 3. 如果函数的参数只有一个,且没有其他内容(默认值,参数解构) => () 可以省略
    //    如果函数没有参数,或参数大于1个, 或者参数有一个但是设置了其他内容(默认值/参数解构) => ()不能省略
    // 4. 如果函数的执行语句只有一条,且是return 语句 => {}和return 可以省略
    //    注意: 如果此时函数的返回值是一个对象 => 需将用()包裹

    // 1. 将函数改为匿名函数 => 箭头函数都是匿名函数
    // function add(a,b){
    //     return a + b;
    // }

    // 2. 省略function关键词,并在形参的小括号之后加 => 
    // var add = function(a,b){
    //     return a + b;
    // }

    // var add = (a,b) => {
    //     return a + b;
    // }

    // 3. 如果函数的参数只有一个,且没有其他内容(默认值,参数解构) => () 可以省略
    //    如果函数没有参数,或参数大于1个, 或者参数有一个但是设置了其他内容(默认值/参数解构) => ()不能省略

    // var add = (a,b) => {  // 有两个参数  不能省略
    //     return a + b;
    // }

    // var double = (v) =>{
    //     return v * 2;
    // }

    // var double = (v = 0) =>{  // 有默认值 不能省略
    //     return v * 2;
    // }

    // var double = v =>{  // 可以省略
    //     return v * 2;
    // }

    // var res = double(10)
    // console.log(res);

    // 4. 如果函数的执行语句只有一条,且是return 语句 => {}和return 可以省略

    // var add = (a,b) => {
    //     return a + b;
    // }

    // 简写
    // var add = (a,b) => a + b;  
    // var res = add(10,20);
    // console.log(res);


    // var double = (v) =>{  // 可以省略
    //     return v * 2;
    // }

    // 简写
    // var double = v => v * 2; 
    // var res = double(10)
    // console.log(res);

    
    // var fn = (v) => {
    //     return {num:v}
    // }

    // 简写
    // var fn = (v) => ({num:v});
    // var res = fn(10); // {num:10}
    // console.log(res);



</script>
</html>